<template>
  <view class="bill">
    <view class="ul">
      <view class="li" v-for="(item, index) in list" :key="index">
        <view class="xx" style="-webkit-flex: 1; flex: 1">
          <view class="zxfs">{{ item.detailed }}</view>
          <view class="sj">{{ item.createTime }}</view>
        </view>
        <view :class="item.inOut == 1 ? 'je' : 'sr'" style="width: 80px"
          >{{ item.inOut == 1 ? '-' : '+' }}{{ item.amount }}</view
        >
      </view>
    </view>
  </view>
</template>

<script>
  import useHttp from '@/utils/http';

  export default {
    data() {
      return {
        list: [
          {
            id: '1',
            zffs: '微信支付',
            sj: '2021-10-09  15:26',
            je: '188.00',
          },
          {
            id: '2',
            zffs: '银联支付',
            sj: '2021-10-09  15:26',
            je: '188.00',
          },
          {
            id: '3',
            zffs: '支付宝支付',
            sj: '2021-10-09  15:26',
            je: '188.00',
          },
        ],
      };
    },
    computed: {},
    onLoad(options) {
      this.getData();
    },
    methods: {
      async getData() {
        let res = await useHttp().get('/api/user/transferRecord', { type: '0' });
        if (res.code == 200) {
          console.log('res', res);
          this.list = res.data.records;
        }
      },
    },
  };
</script>

<style scoped lang="scss">
  // uni-page-body{
  // 	height: 100%;
  // 	padding: 8px 10px 10px 10px;
  .bill {
    // width: 100%;
    padding: 8px 10px 10px 10px;
    .ul {
      width: 100%;
      .li {
        width: 100%;
        height: 70px;
        background: #ffffff;
        border-radius: 5px;
        margin-bottom: 10px;
        display: flex;
        align-items: center;
        .xx {
          padding: 0 10px;
          display: flex;
          flex-direction: column;
          .zxfs {
            font-size: 15px;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 600;
            color: $mainText;
            line-height: 30px;
          }
          .sj {
            font-size: 15px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #999999;
            line-height: 20px;
          }
        }
        .je {
          font-size: 15px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 600;
          color: #09bb07;
          line-height: 70px;
          text-align: center;
        }

        .sr {
          font-size: 15px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 600;
          color: #ff4500;
          line-height: 70px;
          text-align: center;
        }
      }
    }
  }
  // }
</style>
